<template>
  <div class="cardform">
    <el-form
      ref="board"
      :model="board"
      label-width="120px"
      label-position="top"
    >
      <el-form-item label="公告标题" label-width="200px">
        <el-input
          v-model="board.title"
          placeholder="Please input the title"
          style="width:70%;"
        ></el-input>
      </el-form-item>
      <el-form-item label="公告内容" label-width="200px">
        <el-input
          v-model="board.content"
          type="textarea"
          :rows="10"
          placeholder="Please input the content"
          style="width:70%;"
        ></el-input>
      </el-form-item>
      <el-form-item label="类型">
        <el-radio-group v-model="board.type" size="medium" fill="grey">
          <el-radio-button label="1" border style="margin-right:20px;"
            >紧急</el-radio-button
          >
          <el-radio-button label="0" border>普通</el-radio-button>
        </el-radio-group>
      </el-form-item>
      <el-form-item>
        <el-button @click="submit">发布</el-button>
      </el-form-item>
    </el-form>
  </div>
  <!-- <div class="container">
    <div class="boardbox">
      <el-form label-position="top" label-width="80px" :model="board">
        <el-form-item label="公告标题">
          <el-input v-model="board.title"></el-input>
        </el-form-item>
        <el-form-item label="公告内容">
          <el-input v-model="board.content"></el-input>
        </el-form-item>
        <el-form-item label="公告类型">
          <el-radio-group v-model="board.type">
            <el-radio label="1">紧急</el-radio>
            <el-radio label="0">普通</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-button @click="submit">发布</el-button>
      </el-form>
    </div>
    <div class="lunbobox">
      <el-form label-position="top" label-width="80px" :model="board">
        <el-form-item label="公告标题">
          <el-input v-model="board.title"></el-input>
        </el-form-item>
        <el-form-item label="公告内容">
          <el-input v-model="board.content"></el-input>
        </el-form-item>
        <el-form-item label="公告类型">
          <el-input v-model="board.type"></el-input>
        </el-form-item>
      </el-form>
    </div>
  </div> -->
</template>

<script>
export default {
  data() {
    return {
      // 公告内容
      board: {
        title: "",
        content: "",
        time: "",
        author: "",
        img: "",
        type: "",
      },
      // 轮播图内容
      lunbo: {},
    };
  },
  mounted() {},
  methods: {
    // get() {
    //   this.$http
    //     .get("http://localhost:8090/Board/test/" + this.query)
    //     .then((res) => {
    //       console.log(res);
    //     });
    // },
    submit() {
      this.board.author = window.sessionStorage.getItem("tokenid");
      this.board.img = window.sessionStorage.getItem("tokenimg");
      let date = new Date();
      let year = date.getFullYear(); // 年
      let month = date.getMonth() + 1; // 月
      let day = date.getDate(); // 日
      let hour = date.getHours(); // 时
      hour = hour < 10 ? "0" + hour : hour; // 如果只有一位，则前面补零
      let minute = date.getMinutes(); // 分
      minute = minute < 10 ? "0" + minute : minute; // 如果只有一位，则前面补零
      let second = date.getSeconds(); // 秒
      second = second < 10 ? "0" + second : second; // 如果只有一位，则前面补零
      this.board.time = `${year}-${month}-${day} ${hour}:${minute}:${second}`;
      this.$http
        .post("http://localhost:8090/Board/add", this.board)
        .then((res) => {
          console.log(res);
          if (res.data.code == 0) {
            this.$message.success("发布成功！");
            for (let i of this.board) {
              i = "";
            }
          }
        });
    },
  },
};
</script>
<style>
.container {
  display: flex;
  justify-content: space-around;
}
.boardbox,
.lunbobox {
  width: 400px;
  /* background-color: #fff; */
}

.el-main,
main {
  background: url(../../assets/image/houtaibj.png) no-repeat center;
  background-size: contain;
  /* background-size: 100%; */
}
</style>
<style scoped>
.el-button {
  background-color: #b39ba9;
  border: 1px solid #b39ba9;
  color: white;
}
.cardform {
  text-align: center;
  padding: 10px 0;
  border: 1px dashed rgb(168, 153, 153);
  border-radius: 10px;
  background-color: #e6e3e3;
  opacity: 0.7;
  /* background-color: #b19d6e; */
}
</style>
